<template>
  <div>
    <div style="
            width: 100%;
            height: 40px;
            margin-top: 13px;
            display: flex;
            align-items: center;
            justify-content: space-around;
          ">
          <img @click="fh" src="../../assets/heishang.png" alt="" style="width: 22px;height: 22px;">
            <div style="
              background-color: rgb(245, 245, 245);
              width: 300px;
              height: 35px;
              border-radius: 20px;
              display: flex;
              align-items: center;
              justify-content: space-evenly;
              align-items: center;

            ">
                <img src="../../assets/search.png" alt="" style="width: 20px; height: 20px" />
                <input type="text" style="
                background-color: rgb(245, 245, 245);
                width: 220px;
                height: 25px;
              " />
              <img src="../../assets/close.png" style="width: 20px;height: 20px;" alt="">
            </div>
            <img src="../../assets/QRcode.png" style="width: 20px;height: 20px; margin-right: 10px;" alt="">
        </div>
       <div style="width: 100%;height: 40px; margin-top: 10px; display: flex;justify-content: space-between;">
        <div style="width: 180px;height: 30px;display: flex;align-items: center;justify-content: space-between;">
        <van-dropdown-menu style="width: 80px;">
        <van-dropdown-item v-model="value1" :options="option1" />
        </van-dropdown-menu>
        <div>用户</div>
        <div>商品</div>
      </div>
      <van-dropdown-menu>
        <van-dropdown-item v-model="value2" :options="option2" style="height: 30px;"/>
      </van-dropdown-menu>
    </div>
      <Pas/>
  </div>

</template>

<script>
import Pas from '../../components/Shopping_page_shop.vue'
export default {
  components: {
    Pas
  },
  data() {
    return {
      value1: 0,
      value2: 'a',
      option1: [
        { text: '全部', value: 0 },
        { text: '最新', value: 1 },
        { text: '最热', value: 2 },
      ],
      option2: [
        { text: '筛选', value: 'a' },
        { text: '图文', value: 'b' },
        { text: '视频', value: 'c' },
      ],

    };
  },
  methods: {
    fh() {
      this.$router.go(-1)
    }
  }
};
</script>

<style scoped>
* {
    padding: 0;
    margin: 0;
}

input {
    border: 0px;
}

input[type="text"]:focus {
    outline: none;
    background-color: rgb(240, 240, 240);
}
</style>
